import React from "react";
import type { TabsProps} from "antd";
import {Tabs} from "antd";
import Income from "@/pages/m/Income";
import Payment from "@/pages/m/Payment";
import {CustomTabs} from "@/pages/m/CustomTabs";
import {NavBar} from "antd-mobile";

const AddPayOrIncomeLog: React.FC = () => {
  const items: TabsProps["items"] = [
    {
      key: "pay",
      label: "支出",
      children: <Payment/>
    },
    {
      key: 'income',
      label: '收入',
      children: <Income/>
    },
  ]
  return (
    <>
      <NavBar
        back={"返回"}
        style={{position: 'fixed', top: 0, left: 0, width: '100%', zIndex: 9999, backgroundColor: '#f5f5f5'}}
        onBack={()=>history.back()}
      >
        <div style={{fontSize: 16}}>记一笔</div>
      </NavBar>
      <Tabs
        defaultActiveKey={"pay"}
        style={{
          position: "absolute",
          top: 46,
          left: 20,
          width: `calc(100vw - 40px)`,
          height: `calc(100vh - 100px)`,
        }}
        destroyInactiveTabPane
        items={items}
      />
      {/*页脚导航*/}
      <CustomTabs/>
    </>
  )
}
export default AddPayOrIncomeLog;
